text-stroke
or add gradients/textures with background-clip: text;
once browser support is a bit deeper.
⇝ | ◌ | ▨ | ◎ | + | ☀ |
data-icon="⇝" | data-icon="◌" | data-icon="▨" | data-icon="◎" | data-icon="+" | data-icon="☀" |
◈ | ✉ | ⚠ | ⊗ | ⌚ | ⇷ |
data-icon="◈" | data-icon="✉" | data-icon="⚠" | data-icon="⊗" | data-icon="⌚" | data-icon="⇷" |
The icon font used on this page is Fico by Lennart Schoors then ran through IcoMoon for custom mappings. Here's a large collection of more choices. For quick usage, the code is below. To learn about usage in more detail, see this article.
<h3>
<span aria-hidden="true" data-icon="⇝"></span>
Stats
</h3>
<a href="#" class="icon-alone">
<span aria-hidden="true" data-icon="▨"></span>
<span class="screen-reader-text">RSS</span>
</a>